// 被观察者
class Subject {
  private state: string = "init";
  private observers: Observer[] = []; // 观察者列表
  getState() {
    return this.state;
  }
  // 在 React 中，组件就是观察者，状态变化就是数据源，通过 setState 方法改变状态时会触发视图更新
  // 这背后的机制就是观察者模式。
  setState(newState: string) {
    this.state = newState;
    this.notify(); // 通知所有观察者
  }
  // 添加观察者
  attach(observer: Observer) {
    this.observers.push(observer);
  }
  // 通知所有观察者
  private notify() {
    for (const observer of this.observers) {
      observer.update(this.state);
    }
  }
}
// 观察者
class Observer {
  name: string;
  constructor(name: string) {
    this.name = name;
  }
  update(state: string) {
    console.log(`${this.name} update, state is ${state}`);
  }
}

const sub = new Subject(); // 被观察者
const observer1 = new Observer("A");
const observer2 = new Observer("B");
sub.attach(observer1);
sub.attach(observer2);
sub.setState("done"); // 更新状态，触发观察者 update
